<template>
	<view>
		<div id="app" class="weui-tab">
			<div class="weui-tab__bd">
				<div id="tab1" class="weui-tab__bd-item weui-tab__bd-item--active">
					<header class="demos-header"><span class="header-title">缴费记录</span></header>
					<div class="weui-cells">
						<div class="weui-cells__title">户表选择</div>
						<div class="weui-cell weui-cell_select">
							<div class="weui-cell__bd">
								<select class="weui-select" @change="change" v-model="idx">
									<option :value="index" v-for="(item,index) in userList" :key="index">表号：{{item.meterNumber}}</option>
								</select>
							</div>
						</div>
						<div class="weui-cells__title">缴费记录</div>
						<div class="weui-cells" v-if="records.length>0">
							<div class="weui-cell" v-for="(item,index) in records" :key="index">
								<div class="weui-cell__hd"><img src="static/pay-item-logo.png"
										style="width: 20px; height: 20px; padding-right: 4px;"></div>
								<div class="weui-cell__bd" style="font-size: x-small;width: 80px;">
									<p>{{item.createTime}}</p>
								</div>
								<div class="weui-cell__bd" style="font-size: medium;">{{item.paySource}}</div>
								<div class="weui-cell__bd" style="font-size: medium;">{{item.payType}}</div>
								<div class="weui-cell__ft" style="font-size: medium;width: 70px;">￥{{item.payAmount}}</div>
							</div>
						</div>
						<div class="weui-cells" v-else>
							<div style="padding: 10px 20px;font-size: 14px;color: #999;">暂无缴费记录</div>
						</div>
					</div><br><br>
				</div>
			</div>
			<div class="weui-tabbar">
				<navigator url="/pages/index/index" class="weui-tabbar__item weui-bar__item--on router-link-active">
					<div class="weui-tabbar__icon"><img src="static/home-logo.png" alt=""></div>
					<p class="weui-tabbar__label">首页</p>
				</navigator>
			</div>
		</div>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				idx:0,
				userList:[],
				records:[],
				code:''
			}
		},
		onLoad() {
			var _this=this;
			this.$util.checkLogin(function(token){
				console.log("token:"+token)
				_this.$request.getUserList(token,function(list){
					_this.userList=list;
					_this.getChargeLog();
				})
			})
			
		},
		methods: {
			getChargeLog(){
				this.$request.get('wechat/chargeList', {
					meterId:this.userList[this.idx].meterId
				}).then(res=>{
					let records=[];
					let paySourceDict=['','微信缴费','柜台缴费'];
					let payTypeDict=['','充值','冲正','退余额'];
					res.result.records.forEach(item=>{
						item.paySource=paySourceDict[item.paySource];
						item.payType=payTypeDict[item.payType];
						records.push(item);
					})
					this.records=records;
				})
			},
			change(e){
				this.getChargeLog()
			}
		}
	}
</script>

<style>

</style>
